<template>
  <view class="login-page">
    <view class="form">
      <view class="logo">
        <image src="/static/login-logo.png" alt="登录LOGO" />
      </view>
      <view class="username">
        <up-input
          v-model="formState.username"
          placeholder="请输入用户名"
          border="bottom"
          clearable
        ></up-input>
      </view>
      <view class="password">
        <up-input
          v-model="formState.password"
          placeholder="请输入密码"
          password
          border="bottom"
          clearable
        ></up-input>
      </view>
      <view class="submit-btn">
        <up-button
          text="登录"
          shape="circle"
          color="linear-gradient(to right, rgb(250, 176, 155), rgb(236, 6, 53))"
          @click="submitHandle"
        ></up-button>
      </view>
    </view>
  </view>
</template>
<script lang="ts">
export default {
  name: "LoginPage",
};
</script>
<script setup lang="ts">
import { onShow } from "@dcloudio/uni-app";
import InitHook from "./composables/initHook";
import OperationHook from "./composables/operationHook";
import { getAuthent } from "@/network/utils";
const { formState } = InitHook();
const { submitHandle } = OperationHook({ formState });
onShow(() => {
  if (getAuthent("token")) {
    uni.switchTab({
      url: "/pages/layout/waybill/index",
    });
  }
});
</script>
<style scoped lang="scss">
.login-page {
  height: 100vh;
  background-color: #fff;
  padding: 24rpx 48rpx;

  .form {
    .logo {
      width: 280rpx;
      height: 280rpx;

      > image {
        width: 100%;
        height: 100%;
      }
    }

    .username {
      padding-bottom: 36rpx;
    }
  }

  .submit-btn {
    padding-top: 72rpx;
  }
}
</style>
